<template>
	<view class="box" :style="'padding-top:' + (statusBarHeight1*1+50) + 'px'">
		<view class="tou top" :style="'padding-top:' + statusBarHeight1 + 'px'">
			<image @click="fanhui" class="image1" src="https://pic.bangbangtongcheng.com/static/fanhui_bai.png" />
			{{userInfo.businessType==1?'委托房源':'委托车源'}}
		</view>
		<view class="center">
			<scroll-view class="scroll-view" @scrolltolower="down" :scroll-y="modalName == ''|| modalName == null"
				:scroll-top="scrollTop" @scroll="scrolls" refresher-background="#f5f5f5">
				<view class="center_item" v-for="(item,index) in Recommend" :key="index">
					<!-- 这里的房源对应着房源的类型 -->
					<view class="center_item_title" style="display: flex;">
						<view style="color: #64b6a8;width:160rpx;line-height: 40rpx;">{{userInfo.businessType==1?'房源位置':'车辆地址'}}：</view>
						<view style="flex: 1;line-height: 40rpx;">{{item.position}}</view>
					</view>
					<view class="center_item_title"><span style="color: #64b6a8;width:160rpx;">联系电话：</span>{{item.contactInformation}}</view>
					<view class="center_item_title"><span style="color: #64b6a8;width:160rpx;">委托时间：</span>{{item.createDate}}</view>
					<view class="center_item_title" style="word-break: break-all;display: flex;">
						<view style="color: #64b6a8;width:100rpx;line-height: 40rpx;">备注：</view>
						<view style="flex: 1;line-height: 40rpx;">{{item.remarks}}</view>
					</view>
				</view>
				<view v-if="Recommend.length == 0" class="none">
					<image src="https://pic.bangbangtongcheng.com/static/none.png" mode="widthFix" />
					<view>没有更多数据了</view>
				</view>
				<view class="down" v-show="Recommend.length != 0 && !downStatus">没有更多了</view>
			</scroll-view>
		</view>
		<uniBall></uniBall>
		<view class="hui" v-if="scrollTop>20" @click="totop">
			<image src="https://pic.bangbangtongcheng.com/static/top.png" />返回顶部
		</view>
	</view>
</template>
<script>
	import permision from "@/js_sdk/wa-permission/permission.js"
	//#ifdef H5
	import wxshare from "../../utils/index.js";
	//#endif
	import {
		mapGetters
	} from "vuex";
	export default {
		data() {
			return {
				imgUrl: this.$imgSrc,
				userInfo: uni.getStorageSync("Pduser"),
				modalName: "",
				pageSize: 10,
				pageNo: 1,
				Recommend: [],
				trigger: false,
				downStatus: true,
				upStatus: true,
				scrollTop:0
			};
		},
		computed: {
			...mapGetters(["userid", "islogin", "statusBarHeight1", "userinfo"]),
		},
		async onPullDownRefresh() {
			this.Recommend = [];
			this.pageNo = 1;
			this.downStatus = true;
			if (this.upStatus) {
				this.trigger = true;
				await this.entrustedRecord();
			}
		},
		onLoad(option) {
			if (option.index) {
				this.entrustedRecord(option.index)
			}
			/* #ifdef H5 */
			this.jinzhi();
			/* #endif */
		},
		mounted() {},
		onPageScroll: function(Object) {
			this.scrollTop = Object.scrollTop; //实时获取到滚动的值
		},
		methods: {
			scrolls(e){
				console.log(e.detail.scrollTop)
				this.scrollTop = e.detail.scrollTop
			},
			//回到顶部
			totop() {
				uni.pageScrollTo({
					scrollTop: 0,
					duration: 0
				});
			},
			// 获取委托记录
			entrustedRecord(type){
				this.$myRequest.get("/api/mobile/public/getAllDelegationSale",{
					businessType:type
				}).then(res => {
					if (!res.delegationSale.pageList.length) {
						this.downStatus = false;
					}
					if (res.delegationSale.pageCount < this.pageNo * this.pageSize) {
						this.downStatus = false;
					}
					this.upStatus = true;
					this.trigger = false;
					this.Recommend = this.Recommend.concat(res.delegationSale.pageList);
					uni.stopPullDownRefresh();
				});
			},
			down() {
				if (this.downStatus) {
					this.pageNo++;
					this.entrustedRecord();
				}
			},
			async up() {
				this.Recommend = [];
				this.pageNo = 1;
				this.downStatus = true;
				if (this.upStatus) {
					this.trigger = true;
					await this.entrustedRecord();
				}
			},
			fanhui() {
				uni.navigateBack({
					delta: 1
				});
			},
			jinzhi() {
				let _this = this;
				let param = window.location.href.split("#")[0];
				uni.request({
					method: "post",
					data: {
						url: param
					},
					header: {
						"content-type": "application/x-www-form-urlencoded",
					},
					url: "https://www.bangbangtongcheng.com/conven//mob/login/getJsTicket.do",
					success(re) {
						_this.jinzhifx(re.data);
					},
				});
			},
			jinzhifx(data) {
				wxshare.config({
					debug: false, //是否打开调试
					appId: data.appId, // 公众号的唯一标识
					timestamp: data.timestamp, // 生成签名的时间戳
					nonceStr: data.nonce, // ，生成签名的随机串
					signature: data.signature, // 签名
					jsApiList: ["hideMenuItems"],
				});
				// 禁止分享
				wxshare.hideMenuItems({
					// 要隐藏的菜单项，只能隐藏“传播类”和“保护类”按钮，所有menu项见附录3
					menuList: [
						"menuItem:share:appMessage",
						"menuItem:share:timeline",
						"menuItem:share:timeline",
						"menuItem:share:qq",
						"menuItem:favorite",
						"menuItem:share:QZone",
						"menuItem:openWithSafari",
					],
				});
			},

		},
	};
</script>
<style lang="less" scoped>
	.tou {
		position: fixed;
		top: 0;
		width: 100%;
		z-index: 100;
		text-align: center;
		line-height: 88rpx;
		font-size: 36rpx;
		color: #fff;
		background-color: #64b6a8;

		.image1 {
			position: absolute;
			width: 32rpx;
			height: 32rpx;
			// top: 116rpx;
			left: 30rpx;
		}
	}
	page{
		background-color: #fff;
	}
	.box {
		// padding-top: ;
		background-color: #fff;
	}
	.center{
		display: flex;
		flex-direction: column;
		align-items: center;
		margin-left:35rpx;
		margin-top: 30rpx;
		.center_item{
			border: 1px solid #64b6a8;
			width: 680rpx;
			// height: 240rpx;
			border-radius: 20rpx;
			padding:30rpx 40rpx;
			margin-bottom: 20rpx;
			.center_item_title{
				font-size: 32rpx;
				margin-bottom: 12rpx;
			}
		}
	}
	.xinzeng {
		position: absolute;
		bottom: 2px !important;
		color: #fff;
		font-size: 14px;
		// #ifdef MP-WEIXIN
		right: 200rpx;
	
		// #endif
		// #ifndef MP-WEIXIN
		right: 20rpx;
		// #endif
		display: flex;
		align-items: center;
		image{
			width: 54rpx;
			height: 60rpx;
		}
	}
	.genduo{
		position: relative;
		.administrations{
			width: 180rpx;
			height: 280rpx;
			background-color: #fff;
			position: absolute;
			right: 0rpx;
			bottom: -290rpx;
			box-shadow: 0px 0px 20px 1px #D0D0D0;
			z-index: 100;
			padding: 0 32rpx;
			display: flex;
			flex-direction: column;
			.items{
				height: 94rpx;
				color: #5A5E66;
				font-size: 28rpx;
				border-bottom: 1px solid #E0E0E0;
				display: flex;
				align-items: center;
				justify-content: center;
			}
			&::before{
				content: '';
				display: inline-block;
				border-left: 24rpx solid transparent;
				border-right: 20rpx solid transparent;
				border-bottom: 24rpx solid #fff;
				position: absolute;
				right:12rpx;
				top: -22rpx;
			}
		}
	}
	.down {
	  height: 60rpx;
	  line-height: 60rpx;
	  // border-top: 2rpx solid #d0d0d0;
	  text-align: center;
	}
	
	.none {
	  text-align: center;
	
	  image {
	    width: 430rpx;
	    margin-bottom: 16rpx;
	  }
	
	  view {
	    height: 40rpx;
	    line-height: 40rpx;
	    color: #666;
	  }
	}
	.hui {
			position: fixed;
			z-index: 100;
			right: 30rpx;
			bottom: 154rpx;
			display: flex;
			align-items: center;
			padding: 10rpx 20rpx;
			background-color: #fff;
			border-radius: 34rpx;
			font-size: 26rpx;
			box-shadow: 0px 0px 36rpx rgba(0, 0, 0, 0.16);
	
			image {
				width: 46rpx;
				height: 46rpx;
				margin-right: 18rpx;
			}
		}
</style>
